import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutter_play_android/data/model/article_model.dart';
import 'package:flutter_play_android/common/common.dart';
import 'package:flutter_play_android/common/user.dart';
import 'package:flutter_play_android/data/api/apis_service.dart';
import 'package:flutter_play_android/data/model/base_model.dart';
import 'package:flutter_play_android/utils/route_util.dart';
import 'package:flutter_play_android/utils/toast_util.dart';
import 'package:flutter_play_android/widgets/custom_cached_image.dart';

import '../../widgets/like_button_widget.dart';

class ItemArticleList extends StatefulWidget {
  ArticleBean item;

  ItemArticleList({Key? key, required this.item}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return ItemArticleListState();
  }
}

class ItemArticleListState extends State<ItemArticleList> {
  @override
  Widget build(BuildContext context) {
    var item = widget.item;
    return InkWell(
      onTap: () {
        RouteUtil.toWebView(context, item.title, item.link ?? '');
      },
      child: Column(
        children: <Widget>[
          Container(
            padding: const EdgeInsets.fromLTRB(16, 10, 16, 10),
            child: Row(
              children: <Widget>[
                Offstage(
                  offstage: item.top == 0,
                  child: Container(
                    decoration: BoxDecoration(
                      border:
                          Border.all(color: const Color(0xFFF44336), width: 0.5),
                      borderRadius: const BorderRadius.vertical(
                          top: Radius.elliptical(2, 2),
                          bottom: Radius.elliptical(2, 2)),
                    ),
                    padding: const EdgeInsets.fromLTRB(4, 2, 4, 2),
                    margin: const EdgeInsets.fromLTRB(0, 0, 4, 0),
                    child: const Text(
                      "置顶",
                      style: TextStyle(
                          fontSize: 10, color: Color(0xFFF44336)),
                      textAlign: TextAlign.left,
                    ),
                  ),
                ),
                Offstage(
                  offstage: !(item.fresh ?? true),
                  child: Container(
                    decoration: BoxDecoration(
                      border:
                          Border.all(color: const Color(0xFFF44336), width: 0.5),
                      borderRadius: const BorderRadius.vertical(
                          top: Radius.elliptical(2, 2),
                          bottom: Radius.elliptical(2, 2)),
                    ),
                    padding: const EdgeInsets.fromLTRB(4, 2, 4, 2),
                    margin: const EdgeInsets.fromLTRB(0, 0, 4, 0),
                    child: const Text(
                      "新",
                      style: TextStyle(
                          fontSize: 10, color: Color(0xFFF44336)),
                      textAlign: TextAlign.left,
                    ),
                  ),
                ),
                Offstage(
                  offstage: item.tags?.isEmpty ?? true,
                  child: Container(
                    decoration: BoxDecoration(
                      border: Border.all(color: Colors.cyan, width: 0.5),
                      borderRadius: const BorderRadius.vertical(
                          top: Radius.elliptical(2, 2),
                          bottom: Radius.elliptical(2, 2)),
                    ),
                    padding: const EdgeInsets.fromLTRB(4, 2, 4, 2),
                    margin: const EdgeInsets.fromLTRB(0, 0, 4, 0),
                    child: Text(
                      (item.tags?.length ?? 0) > 0 ? item.tags![0].name! : "",
                      style: const TextStyle(fontSize: 10, color: Colors.cyan),
                      textAlign: TextAlign.left,
                    ),
                  ),
                ),
                Text(
                  (item.author?.isNotEmpty ?? false)
                      ? item.author!
                      : (item.shareUser ?? ''),
                  style: TextStyle(fontSize: 12, color: Colors.grey[600]),
                  textAlign: TextAlign.left,
                ),
                Expanded(
                  child: Text(
                    item.niceDate ?? '',
                    style: TextStyle(fontSize: 12, color: Colors.grey[600]),
                    textAlign: TextAlign.right,
                  ),
                ),
              ],
            ),
          ),
          Row(
            children: <Widget>[
              Offstage(
                offstage: item.envelopePic == "",
                child: Container(
                    width: 100,
                    height: 80,
                    padding: const EdgeInsets.fromLTRB(16, 8, 0, 8),
                    child:
                        CustomCachedImage(imageUrl: item.envelopePic ?? '')),
              ),
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: <Widget>[
                    Container(
                      alignment: Alignment.topLeft,
                      padding: const EdgeInsets.fromLTRB(16, 0, 16, 0),
                      child: Text(
                        item.title ?? '',
                        maxLines: 2,
                        style: const TextStyle(fontSize: 16),
                        textAlign: TextAlign.left,
                      ),
                    ),
                    Container(
                      alignment: Alignment.topLeft,
                      padding: const EdgeInsets.fromLTRB(16, 10, 16, 10),
                      child: Row(
                        children: <Widget>[
                          Expanded(
                            child: Text(
                              "${item.superChapterName ?? ''} / ${item.chapterName ?? ''}",
                              style: TextStyle(
                                  fontSize: 12, color: Colors.grey[600]),
                              textAlign: TextAlign.left,
                            ),
                          ),
                          LikeButtonWidget(
                            isLike: item.collect ?? false,
                            onClick: () {
                              addOrCancelCollect(item);
                            },
                          )
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
          const Divider(height: 1)
        ],
      ),
    );
  }

  /// 添加收藏或者取消收藏
  void addOrCancelCollect(item) {
    List<String>? cookies = User.singleton.cookie;
    if (cookies == null || cookies.isEmpty) {
      ToastUtil.show(msg: '请先登录~');
    } else {
      if (item.collect) {
        apiService.cancelCollection((BaseModel model) {
          if (model.errorCode == Constants.STATUS_SUCCESS) {
            ToastUtil.show(msg: '已取消收藏~');
            setState(() {
              item.collect = false;
            });
          } else {
            ToastUtil.show(msg: '取消收藏失败~');
          }
        }, (DioError error) {
          print(error.response);
        }, item.id);
      } else {
        apiService.addCollection((BaseModel model) {
          if (model.errorCode == Constants.STATUS_SUCCESS) {
            ToastUtil.show(msg: '收藏成功~');
            setState(() {
              item.collect = true;
            });
          } else {
            ToastUtil.show(msg: '收藏失败~');
          }
        }, (DioError error) {
          print(error.response);
        }, item.id);
      }
    }
  }
}
